<!--
 * @Description: file content
 * @Author: oooh
 * @Date: 2024-04-26 11:16:35
 * @LastEditors: hujunjie hujunjie@shudatech.cn
 * @LastEditTime: 2024-12-13 14:57:33
 * @FilePath: \Civil_Servant_Performance_PC\src\views\performance-inventory\dept\dept-honor.vue
-->
<template>
  <div class="component-container">
    <div class="flex-table">
      <el-table
        :data="workList"
        border
        style="width: 100%"
        height="100%"
        v-loading="loading"
      >
        <el-table-column label="序号" type="index" align="center">
          <template slot-scope="scope">
            <span>{{ scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="培训日期"
          prop="date"
          align="center"
        ></el-table-column>
        <el-table-column
          label="培训主题"
          prop="theme"
          align="center"
        ></el-table-column>
        <el-table-column
          label="培训地点"
          prop="address"
          align="center"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          label="参加干部"
          prop="civilServantName"
          align="center"
        ></el-table-column>
        <el-table-column
          label="所属站办所"
          prop="deptName"
          align="center"
        ></el-table-column>
        <el-table-column
          label="备注"
          prop="remarks"
          align="center"
        ></el-table-column>
      </el-table>
    </div>
    <pagination
      v-show="tableTotal > 0"
      :total="tableTotal"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
  </div>
</template>

<script>
import { list } from "@/api/work/work-training";
import { mixins } from "@/mixins";
export default {
  name: "performance-inventory_dept_work-training",
  mixins: [mixins],
  dicts: [],
  props: {
    queryForm: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      columns: [],
      loading: false,
      workList: [],
      tableTota: 0,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
    };
  },
  computed: {},
  watch: {
    queryForm: {
      deep: true,
      immediate: true,
      handler(query) {
        this.queryParams = { ...this.queryParams, ...query };
        this.getList();
      },
    },
  },
  methods: {
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    getList() {
      this.loading = true;
      list(this.queryParams)
        .then((res) => {
          this.loading = false;
          let { rows, total } = res;
          this.tableTotal = total;
          this.workList = rows;
        })
        .catch((err) => (this.loading = false));
    },
    // 刷新
    handleRefresh() {
      this.getList();
    },
  },
};
</script>

<style lang="scss">
.el-input-number--medium {
  width: auto;
}
</style>
